AngularJS is a JavaScript MVC framework for Front End Web Development that allows you to create SPA Single-Page Applications . It falls within the family of frameworks such as Backbone JS or Ember JS .
With so much offer of frameworks it is difficult for us to choose which one to use in our applications, what advantages do they have over others, etc. In this post I am going to comment on what makes AngularJS different from the rest and a few links to online resources where you can learn to use this framework and gain fluency. Here we go.
Luckily, frameworks emerged that implemented the MVC pattern (Model, View, Controller) and helped us to separate concepts. The best known is Backbone JS, which emerged in 2010 created by Jeremy Ashkenas (Creator also of Coffee Script ) and depends on 2 other libraries: jQuery and Underscore.js It is used by multiple Start-ups such as Pinterest , Foursquare , AirBnB , Trello , etc .
However, AngularJS is going strong. Although its first version is from 2009, it became very popular at the end of 2012 and now in 2013 it is booming. So much so that there is already talk of a new technology stack as before it was LAMP ( Linux + A patch + MySQL + PHP) now the trend is MEAN ( MongoDB / Mongoose + Express JS + AngularJS + NodeJS), which which also translates to End-to-End JavaScript applications.
AngularJS is maintained by Google and quite a community. Also as a point in its favor is how easy it is to create Unit and End-to-End Tests with Jasmine and Karma , something that is usually a bit expensive at first.
AngularJS allows extending the HTML vocabulary with directives and attributes, maintaining semantics and without the need to use external libraries such as jQuery or Underscore.js to make it work. To learn how to use this framework in a short time, I recommend you follow these steps that Joel Hooks cites on his blog :
Table of Contents
Official AngularJS tutorial
Google has made available to us on the official project page a step-by-step tutorial through a simple web application (A catalog of Smartphones) that helps us understand the basics and vocabulary. The only cons of this material is that it uses the angular-seed project as a template which, although it is good to learn, is not recommended for a real project that needs to scale. Still, starting here is a good step.
Video-Tutorials From Egghead.io.
Once the tutorial is complete, the next step is to take a look at the videos of John Lindquist, an expert developer in AngularJS . They are short videos, of no more than 8 minutes each, in which he goes into detail on the more difficult concepts of AngularJS. Even if you don’t understand everything at first it doesn’t matter, keep these videos in mind for later.
A Look At A Real AngularJS Application
Now is the time to see the “guts” of an AngularJS application that works in the real world. The best example is the code developed by Peter Bacon Darwin and Pawel Kozlowsk i for the Mastering Web Application with AngularJS book . The source code is available on GitHub and we can see the directory structure, the use of modules, testing, communication with a RESTful API in the Back-End, security, etc. It’s a 100% MEAN app!
Create Your First Application With Ng-Boilerplate.
At this point we should already have enough knowledge to build an application with AngularJS. For this we can use the ng-boilerplate project which is a good base to start developing a valid application for a production environment as opposed to angular-seed which is only valid for learning the technology.
If you manage to get here, you will have a good knowledge of web application development using AngularJS, I am right now between the 2nd and 3rd stage and I am seeing the progress, therefore I recommend following these steps if you are interested in this new framework, which I think in a short time will become much more used than Backbone.